<template>
  <div class="user">
   <user-search @query-click="handlehandleClcik" @reset-click="handleResetClick"></user-search>
    <user-content ref="contentRef" @new-click="handleNewClick" @edit-click="handleEditClick"></user-content>
    <user-modal ref="modalRef"></user-modal>
  </div>
</template>
<script setup lang="ts">
import {ref} from "vue"
import userModal from "./c-cpns/user-modal.vue";
import userSearch from "./c-cpns/user-search.vue";
import UserContent from "./c-cpns/user-content.vue";
const contentRef=ref<InstanceType< typeof UserContent>>()
  const modalRef=ref<InstanceType< typeof userModal>>()
function handlehandleClcik(formData:any){
    // console.log(formData)
    //  console.log(contentRef)
    contentRef.value?.fetchUserListDate(formData)
}
function handleResetClick(){
  contentRef.value?.fetchUserListDate()
}
function handleNewClick(){
  modalRef.value?.setModalVisible(true)
}
// 编辑
function handleEditClick(itemData:any){
  modalRef.value?.setModalVisible(false,itemData)
}
</script>
<style lang="less" scoped>
.user {
  border-radius: 8px;
  overflow: hidden;
}
</style>
